<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>密码找回 - 有间工作室</title>
    <link rel="stylesheet" type="text/css" href="/static/index/style/register-login.css">
    <link rel="stylesheet" href="/static/index/css/youjian.css">
	<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="/static/index/js/vector.js"></script>
    <script>
        $(function () {
            var victor = new Victor("container", "output")
        })
    </script>
</head>
<body id="container">
    <div id="output">
        <div class="cent-box-header">
            <h1 class="main-title hide">有间</h1>
        </div>
        <div class="cent-box" style="margin-top: 250px;">
            <div class="cont-main clearfix">
                <div class="index-tab">
                    <div class="index-slide-nav">
                        <a href="{{url_for('.verify')}}" class="active">&nbsp;&nbsp;找 回 密 码</a>
                        <div class="slide-bar"></div>
                    </div>
                </div>
                <div class="login form">
                    <div class="group">
                        <div class="group-ipt email">
                            <input type="text" name="mobile" id="mobile" class="ipt" value="" placeholder="输入手机号"
                                required>
                        </div>

                        <div class="group-ipt verify">
                            <input type="text" name="verify" id="verify" class="ipt" placeholder="输入验证码" required>
                            <button class="imgcode verify-btn" onclick="sendSMSCode()">获取验证码</button>

                        </div>
                    </div>
                </div>
                <div class="button">
                    <button type="submit" class="login-btn register-btn" id="button">验证</button>
                </div>
                <a href="{{url_for('.login')}}" style="color:#f7a280;">返 回 登 录</a>
                <a href="{{url_for('.register')}}" style="margin-left:130px; color:#f7a280">注 册 新 用 户</a>
            </div>
        </div>
    </div>

<script src='/static/index/js/particles.js' type="text/javascript"></script>
<script src='/static/index/js/background.js' type="text/javascript"></script>
<script src='/static/index/js/jquery.min.js' type="text/javascript"></script>
<script src='/static/index/js/layer/layer.js' type="text/javascript"></script>
<script src='/static/index/js/index.js' type="text/javascript"></script>
<script>
        function sendSMSCode() {
            // 校验参数，保证输入框有数据填写
            $(".imgcode").removeAttr("onclick");
            var mobile = $("#mobile").val();
            if (!mobile) {
                layer.msg("未填写手机号！")
                $(".imgcode").attr("onclick", "sendSMSCode();");
                return;
            }

	    var mobile = $('#mobile').val();
	    var params = {
            "mobile": mobile,

        };
		$.ajax({
        // 请求地址
        url: "{{ url_for('passport_blue.send_sms_code') }}",
        // 请求方式
        method: "POST",
        // 请求内容
        data: JSON.stringify(params),
        // 请求内容的数据类型
        contentType: "application/json",
        // 响应数据的格式
        dataType: "json",
        success: function (resp) {
            if (resp.errno == "0") {
                layer.msg(resp.errmsg)
                // 倒计时60秒，60秒后允许用户再次点击发送短信验证码的按钮
                var num = 60;
                // 设置一个计时器
                var t = setInterval(function () {
                    if (num == 1) {
                        // 如果计时器到最后, 清除计时器对象
                        clearInterval(t);
                        // 将点击获取验证码的按钮展示的文本回复成原始文本
                        $(".imgcode").html("获取验证码");
                        // 将点击按钮的onclick事件函数恢复回去
                        $(".imgcode").attr("onclick", "sendSMSCode();");
                    } else {
                        num -= 1;
                        // 展示倒计时信息
                        $(".imgcode").html(num + "秒");
                    }
                }, 1000)
            } else if(resp.errno == "2005"){
            	layer.msg(resp.errmsg)
            	setTimeout(function () {
            		window.location.href = "{{url_for('.register')}}"
					}, "1000");

            } else {
                // 表示后端出现了错误，可以将错误信息展示到前端页面中

                layer.msg(resp.errmsg)


                // 将点击按钮的onclick事件函数恢复回去
                $(".imgcode").attr("onclick", "sendSMSCode();");
                // 如果错误码是4004，代表验证码错误，重新生成验证码
                if (resp.errno == "4004") {
                    generateImageCode()
                }
            }
        }
    })
}



    $('.login-btn').click(function(){
        var mobile = $('#mobile').val()
        var verify = $('#verify').val()
        $.ajax({
            url: "{{url_for('.verify')}}",
            type: "post",
            data : {
                "mobile":mobile,
                "verify":verify
            },
            success:function(data){
                errno = data.errno;
                errmsg = data.errmsg;
                layer.msg(errmsg);
                if (errno == 0){
                	setTimeout(function(){
                		window.location.href = "{{url_for('.reset_pwd')}}"
                	}, "1000")
                }
            }
        })
    })

	$("#remember-me").click(function(){
		var n = document.getElementById("remember-me").checked;
		if(n){
			$(".zt").show();
		}else{
			$(".zt").hide();
		}
	});
</script>
</body>

</html>